<template>
  <el-dialog :visible.sync="tabDialog" :close-on-click-modal="false" :before-close="tabCancel" append-to-body :fullscreen="tabDialog" @close="tabCancel">
    <div class="app-container">
      <!--工具栏-->
      <div class="head-container">
        <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
          <el-tab-pane label="未分配" name="first">
            <approve ref="approve" />
          </el-tab-pane>
          <el-tab-pane label="已分配" name="second">
            <appr1 ref="appr1" />
          </el-tab-pane>
        </el-tabs>
      </div>
    </div>
  </el-dialog>
</template>

<script>
import approve from '../zhsq/approve'
import appr1 from '../zhsq/appr1'
export default {
  components: { approve, appr1 },
  data() {
    return {
      activeName: 'first',
      tabDialog: false,
      bisHljgId: ''
    }
  },
  methods: {
    tabOpen() {
      console.log('-----' + this.bisHljgId)
      this.$refs.approve.approveDialog = true
      this.$refs.approve.bisHljgId = this.bisHljgId
      this.$refs.approve.query.bisHljgId = this.bisHljgId
      this.$refs.appr1.approveDialog = true
      this.$refs.appr1.bisHljgId = this.bisHljgId
      this.$refs.appr1.query.bisHljgId = this.bisHljgId
      this.$refs.approve.crud.toQuery()
    },
    tabCancel() {
      this.tabDialog = false
    },
    handleClick(tab, event) {
      const name = tab.name
      console.log('------------------' + name)
      if (name === 'first') {
        console.log('12222222222222222')
        this.$refs.approve.crud.toQuery()
        console.log('32222222222222222')
      } else if (name === 'second') {
        console.log('22222222222222222')
        this.$refs.appr1.crud.toQuery()
      }
    }
  }
}
</script>

<style scoped>

</style>
